<template>
  <el-pagination
    v-bind="$attrs"
    :current-page="pageNo"
    background
    :page-size="pageNum"
    layout="total, sizes, prev, pager, next, jumper"
    :total="total"
    @size-change="handleSizeChange"
    @current-change="handleCurrentChange"
  ></el-pagination>
</template>

<script setup>
import { defineEmits } from 'vue'
const emits = defineEmits(['size-change', 'current-change'])
const props = defineProps({
  pageNo: {
    type: [String, Number],
    default: 1,
  },
  pageNum: {
    type: [String, Number],
    default: 10,
  },
  // 总页数
  total: {
    type: [String, Number],
    required: true,
    default: 0,
  },
})
// 页数改变的时候触发的事件
const handleSizeChange = (val) => {
  emits('size-change', val)
}
// 当前页改变的时候触发的事件
const handleCurrentChange = (val) => {
  emits('current-change', val)
}
</script>
